<template>
  <div>
    <el-form :inline="true" :model="dataForm" @keyup.enter.native="_obtainTables()" size="mini" label-width="150px">
      <el-form-item label="数据库地址：">
        <el-input v-model="dataForm.url" placeholder="数据库地址" clearable style="width: 1225px"></el-input>
      </el-form-item>
      <el-form-item label="用户名：">
        <el-input v-model="dataForm.user" placeholder="用户名" clearable></el-input>
      </el-form-item>
      <el-form-item label="密码：">
        <el-input v-model="dataForm.password" placeholder="密码" clearable></el-input>
      </el-form-item>
      <el-form-item label="数据库：">
        <el-select v-model="dataForm.dataBase" placeholder="请选择">
          <el-option
            v-for="item in dataBases"
            :key="item"
            :value="item">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="驱动：">
        <el-input v-model="dataForm.className" placeholder="驱动" clearable style="width: 200px"></el-input>
      </el-form-item>
      <el-form-item label="包前缀：">
        <el-input v-model="dataForm.packageName" placeholder="包前缀" clearable></el-input>
      </el-form-item>
      <el-form-item label="作者：">
        <el-input v-model="dataForm.author" placeholder="作者" clearable></el-input>
      </el-form-item>
    </el-form>
    <hr/>
    <div style="margin-bottom: 5px">
      <el-button @click="_obtainTables()" size="mini">查询</el-button>
      <el-button  type="primary" @click="_generateCode()" size="mini">生成代码</el-button>
    </div>

    <el-table
      :data="dataList" border v-loading="dataListLoading" @selection-change="selectionChangeHandle" style="width: 100%;">
      <el-table-column type="selection" header-align="center" align="center" width="50">
      </el-table-column>
      <el-table-column prop="tableName" header-align="center" align="center" width="300" label="表名">
      </el-table-column>
      <el-table-column prop="tableComment" header-align="center" align="center" label="表描述">
      </el-table-column>
    </el-table>

  </div>
</template>

<script>
    import { generateCode , obtainlDataBases,obtainTables } from '@/api/generate'
    export default {
        name: "generate",
        data () {
            return {
                dataForm: {
                    url:'jdbc:mysql://127.0.0.1:3306/develop_code?useUnicode=true&characterEncoding=utf-8&serverTimezone=Hongkong&useSSL=false',
                    dataBase: '',
                    className:'com.mysql.cj.jdbc.Driver',
                    user:'root',
                    password:'123456',
                    tableNames:[],
                    packageName:'com.dream21th',
                    author:'dream21th'
                },
                dataList: [],
                dataBases:[],
                dataListLoading: false,
                dataListSelections: [],
            }
        },
        methods:{
            _generateCode(){
                const request={
                    "requestData":this.dataForm
                }
                generateCode(request).then((res)=>{
                    if(res.code=='0000'){
                        var url=res.responseData;
                        window.open(url)
                    }
                })
            },
            _obtainlDataBases(){
                const request={
                    "requestData":this.dataForm
                }
                obtainlDataBases(request).then((res)=>{
                    if(res.code=='0000'){
                        this.dataBases=res.responseData;
                    }
                })
            },
            _obtainTables(){
                const request={
                    "requestData":this.dataForm
                }
                obtainTables(request).then((res)=>{
                    if(res.code=='0000'){
                        this.dataList=res.responseData;
                    }
                })
            },
            // 多选
            selectionChangeHandle (val) {
                const tableNames=[]
                for(var i=0;i<val.length;i++){
                    tableNames.push(val[i].tableName)
                }
                this.dataForm.tableNames = tableNames
            },
        },
        created() {
            this._obtainlDataBases()
        }
    }
</script>

<style scoped>

</style>
